/**
 * Created by zjqian on 2018/8/14.
 */

import React, {
    Component
} from 'react';
import {
    TextInput,
    StyleSheet,
    View,
    Text,
    TouchableOpacity
} from 'react-native';
import color from '../../macro/color';
import px2dp from '../../utils/px2dp';
import {
    sign,
    md5,
} from '../../utils/signUtils';
import Tab from '../base/bottomTab';
import Register from './register';
import Reset from './resetPwd';
import NetRequest from '../../tool/NetRequest';

export default class Login extends Component {

    static navigationOptions = {
        headerTitle: "杂货铺",
        headerStyle: {
            backgroundColor: 'white',
        },
        headerTitleStyle: {
            fontSize: px2dp(18),
            color: color.color333,
        },
    };

    constructor(props) {
        super(props);
        this.state = {
            accountText: '',
            passwordText: '',
        }
    }

    render() {
        return (
            <View style={styles.container}>
                <Text style={{marginTop: px2dp(115), fontFamily: 'PingFangSC-Medium',color: color.color333,fontSize: 22}}>登录</Text>
                <TextInput style={{fontSize: 16, marginTop: px2dp(40), height: 40}}
                           placeholder={'请输入11位手机号'}
                           placeholderTextColor={'#A1A1A1'}
                           onChangeText={(text) => this.setState({accountText: text})}
                           value={this.state.accountText}
                           keyboardType={'number-pad'}
                           clearButtonMode={'while-editing'}/>
                <View style={{height: 0.5, backgroundColor: color.line}}/>
                <TextInput style={{fontSize: 16, marginTop: px2dp(20), height: 40}}
                           placeholder={'请输入6-16位密码'}
                           placeholderTextColor={'#A1A1A1'}
                           onChangeText={(text) => this.setState({passwordText: text})}
                           value={this.state.passwordText}
                           secureTextEntry={true}
                           clearButtonMode={'while-editing'}/>
                <View style={{height: 0.5, backgroundColor: color.line}}/>
                <TouchableOpacity activeOpacity={0.5} style={{justifyContent: 'flex-end', flexDirection: 'row',marginTop: 10}} onPress={this.resetPress.bind(this)}>
                    <Text style={{color: color.color333, fontSize: 14}}>忘记密码?</Text>
                </TouchableOpacity>
                <TouchableOpacity activeOpacity={0.5} style={styles.btn_login} onPress={this.loginPress.bind(this)}>
                    <Text style={{color: color.white, fontSize: 14}}>登录</Text>
                </TouchableOpacity>

                <TouchableOpacity activeOpacity={0.5} style={{marginTop: px2dp(40), alignItems: 'center'}} onPress={this.registerPress.bind(this)}>
                    <Text style={{color: color.color999}}>去注册</Text>
                </TouchableOpacity>
            </View>

        )
    };

    loginPress() {

        let app_key = '0D45B5FDF75D12C8EF6628D4884FF3AA'
        let account = this.state.accountText
        let pwd = this.state.passwordText
        let params = {s: 'App.User.Login',username: account,password: md5(pwd),app_key: app_key}
        let sign1 = sign(params)
        params['sign'] = sign1
        NetRequest.get('http://hn2.api.okayapi.com',params,null).then((response) => {

            if (response['ret'] == 200) {

                if (response['data']['err_code'] != 0) {
                    alert(response['data']['err_msg'])
                }else {
                    this.props.navigation.navigate('Tab')
                }
            } else {
                alert(response['msg'])
            }
        }, (error) => {
            alert('error')
        })

    };
    registerPress() {
        this.props.navigation.navigate('Register')
    };
    resetPress() {
        this.props.navigation.navigate('Reset')
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: 'white',
        paddingHorizontal: px2dp(30),
    },
    btn_login: {
        justifyContent: 'center',
        alignItems: 'center',
        marginTop: 10,
        backgroundColor: '#C44848',
        height: 42,
        marginTop: px2dp(60),
    }
})